<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>Title</title>
	</head>
	<body>
		<ul>
			<li>高圆圆</li>
			<li>周二珂</li>
			<li>冯提莫</li>
			<li>郑爽</li>
		</ul>
		
		<script src="jquery-1.12.4.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				//css(name,type)
				//修改单个样式
				//name：样式名  value：样式值
				// $("li").css("backgroundColor","pink").css("color","red").css("fontSize","32px");

				//css(obj)
				//修改多个样式
				// $("li").css({
				// 	backgroundColor:"pink",
				// 	color:"red",
				// 	fontSize:"32px",
				// 	border:"1px solid black"
				// });

				//获取样式
				//css(name)
				//name:想要获取的样式
				$("li").eq(0).css("fontSize","20px");
				$("li").eq(1).css("fontSize","21px");
				$("li").eq(2).css("fontSize","22px");
				$("li").eq(3).css("fontSize","23px");

				//A:20  b:21  c:22    d:23   e:16  f:[20,21,22,23]

				//隐式迭代：
					//设置操作的时候：会给jq内部的所有对象都设置上相同的值
				//获取的时候： 只会返回第一个元素对应的值
				console.log($("li").css("fontSize"));//16px

			});
		</script>
	</body>
</html>